<template>
	<lay-container fluid="true" style="padding: 10px">
		<lay-row>
			<lay-col :md="24">
				<lay-card>
					<lay-form style="margin: 0px; padding: 0px;">
						<lay-space>
							<lay-form-item style="margin: 0px;">
								<lay-select style="width: 110px" size="sm" v-model="page.SearchField">
									<lay-select-option value="id" label="主键"></lay-select-option>
									<lay-select-option value="name" label="名称"></lay-select-option>
									<lay-select-option value="dbid" label="账户"></lay-select-option>
									<lay-select-option value="type" label="类型"></lay-select-option>
									<lay-select-option value="state" label="状态"></lay-select-option>
									<lay-select-option value="time_new" label="建立日期"></lay-select-option>
									<lay-select-option value="time_up" label="修改日期"></lay-select-option>
								</lay-select>
							</lay-form-item>
							<lay-form-item style="margin: 0px;">
								<lay-select style="width: 76px" size="sm" v-model="page.SearchOperator">
									<lay-select-option value="LIKE" label="默认"></lay-select-option>
									<lay-select-option value="=" label="等于"></lay-select-option>
									<lay-select-option value=">" label="大于"></lay-select-option>
									<lay-select-option value="<" label="小于"></lay-select-option>
									<lay-select-option value="<>" label="不等"></lay-select-option>
								</lay-select>
							</lay-form-item>
							<lay-form-item style="margin: 0px;">
								<lay-input style="width: 180px" size="sm" :allow-clear="true" placeholder="关键词"
									v-model="page.SearchaAtistop"></lay-input>
							</lay-form-item>
							<lay-form-item style="margin: 0px;">
								<lay-select style="width: 82px" size="sm" v-model="page.SearchaSort">
									<lay-select-option value="DESC" label="降序↓"></lay-select-option>
									<lay-select-option value="ASE" label="升序↑"></lay-select-option>
								</lay-select>
							</lay-form-item>
							<lay-form-item style="margin: 0px;">
								<lay-select style="width: 110px" size="sm" v-model="page.SearchaSortField">
									<lay-select-option value="id"
										:label="(page.SearchaSort == 'DESC') ? '主键↓' : '主键↑'"></lay-select-option>
									<lay-select-option value="name"
										:label="(page.SearchaSort == 'DESC') ? '名称↓' : '名称↑'"></lay-select-option>
									<lay-select-option value="dbid"
										:label="(page.SearchaSort == 'DESC') ? '账户↓' : '账户↑'"></lay-select-option>
									<lay-select-option value="type"
										:label="(page.SearchaSort == 'DESC') ? '类型↓' : '类型↑'"></lay-select-option>
									<lay-select-option value="state"
										:label="(page.SearchaSort == 'DESC') ? '状态↓' : '状态↑'"></lay-select-option>
									<lay-select-option value="time_new"
										:label="(page.SearchaSort == 'DESC') ? '建立日期↓' : '建立日期↑'"></lay-select-option>
									<lay-select-option value="time_up"
										:label="(page.SearchaSort == 'DESC') ? '修改日期↓' : '修改日期↑'"></lay-select-option>
								</lay-select>
							</lay-form-item>
							<lay-form-item style="margin: 0px;">
								<lay-button size="sm" type="primary" @click="ListSubmit">查询</lay-button>
							</lay-form-item>
						</lay-space>
					</lay-form>
				</lay-card>
			</lay-col>
			<lay-row space="0">
				<lay-col md="24">
					<lay-card>
						<lay-table :columns="PN.columns" :dataSource="dataSource" :default-toolbar="defaultToolbar" even>
							<template v-slot:toolbar>
								<lay-button size="sm" type="primary" @click="addWindow('new', null)">新增</lay-button>
								<lay-button size="sm" type="primary" @click="ListSubmit">刷新</lay-button>
							</template>
							<template v-slot:index2="{ data }">{{ data.index2 }}</template>
							<template v-slot:id="{ data }">{{ data.id }}</template>
							<template v-slot:goods_dbid="{ data }">{{ data.goods_dbid }}</template>
							<template v-slot:number="{ data }">{{ data.number }}</template>
						
							<template v-slot:footer>
								<lay-page v-model="page.current" :limit=page.limit :total=page.total :show-page="true"
									showCount showSkip :limits="[3, 10, 20, 30, 40, 50, 100]" :pages="6"
									@change="change"></lay-page>
							</template>
						</lay-table>
					</lay-card>
				</lay-col>
			</lay-row>
			<!-- </lay-col> -->

		</lay-row>
	</lay-container>
	<!-- <sonWindow ref="sonWindowRef" v-model:upbd="upbd" @topClick="topFn" /> -->
	<!-- <sonWindow ref="sonWindowRef" @topClick="topFn" /> -->
	<!-- <vxetable /> -->
</template>

<script setup lang="ts">
import { ref, onMounted } from "vue";
import MyModal from './MyModal.vue'
import { layer } from "@layui/layer-vue";
// import sonWindow from "./module/indexWindow.vue";
import { StockList } from "../../api/module/user"; //请求模块

import PNDB from "./indexPN";
const PN = new PNDB;
const bbs = PN.AA('PN加载......' + window.location.href);
const defaultToolbar = ref(true);
const page = ref({
	total: 0,//总行数
	limit: 3,//每页行数
	current: 1,//页码
	SearchField: 'id',//默认搜索字段
	SearchOperator: 'LIKE',//默认搜索查询表达式
	SearchaAtistop: "",//默认搜索关键词
	SearchaSort: 'DESC',//默认搜索排序方式ASE,DESC升降序
	SearchaSortField: 'id',//默认排序字段
});

//监听子组件
const topFn = function (db: any) {
	console.log("我的父组件中的方法", db);
	ListSubmit()
};


// 数据集
const dataSource = ref([]);

const ListSubmit = async () => {
	let data = await StockList(page.value);
	layer.load(0, { time: 1000 })
	console.log("远程回调", data);
	if (data.code == 200) {
		// layer.msg(data.msg, { icon: 1 }, async () => {
		dataSource.value = data.data.data;//数据集
		page.value.total = data.data.total;//数据总行数
		// });
	} else {
		layer.msg(data.msg, { icon: 2 });
	}
};


const sonWindowRef = ref<InstanceType<typeof MyModal> | null>(null)

// 打开弹窗
const addWindow = function (op: string, data: any) {
	console.log("打开弹窗", op, data);
	sonWindowRef.value?.childFun(op, data);//子组件方法
};


const change = function ({ current, limit }: any) {
	console.log("当前页码:" + current + " 每页数量:" + limit);
	page.value.current = current;//当前页码
	page.value.limit = limit;//每页数量
	ListSubmit();
};



// 生命周期
onMounted(() => {
	ListSubmit();
	console.log(bbs);

})
</script>
